{% extends "dappx/base.html" %}
{% load static %}
{% block body_block %}


    <div class="row justify-content-center">

      <div class="col-xl-10 col-lg-12 col-md-9">

        <div class="card o-hidden border-0 shadow-lg my-5">
          <div class="card-body p-5">
            <!-- Nested Row within Card Body -->
            <div class="row">
              <!-- <div class="col-lg-6 d-none d-lg-block bg-login-image"></div> -->
              <div class="col-lg-6">
                <div class="p-5">
                  <!-- <div class="text-center"> -->
										{% if errors %}
														<div class="alert alert-danger" id="errorBox">
																	The user name or email is not valid.
														</div>
										{% else %}
										        {% if registered %}
																		<div class="alert alert-success" >
																						<h1 class="h4 text-gray-900 mb-4">Welcome Back!</h1>
																		</div>
														{% endif %}
										{% endif %}
                  <!-- </div> -->
										<form id="registerForm" enctype="multipart/form-data" method="POST">
												<div class="form-group">
															{% csrf_token %}
																	
													<input type="text" name="username" class="form-control form-control-user" required id="id_username"  placeholder="User Name">
													<input type="password" name="password" class="form-control form-control-user"  required id="id_password" placeholder="Password"  >
													<input type="email" name="email" maxlength="254" class="form-control form-control-user"  id="id_email" placeholder="Email">
												</div>
															<button class="btn btn-primary btn-user btn-block" type="submit"  onclick="UserRegister()" id="register-btn" >Register</button>
										</form>
                  
                  <hr>
                  <div class="text-center">
                    <a class="small" href="forgot-password.html">Forgot Password?</a>
                  </div>
                  <div class="text-center">
                    <a class="small" href="/dappx/register">Create an Account!</a>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

<script>
				function UserRegister(){
            formData = $('#registerForm').serialize();  
	          // formData.append('csrfmiddlewaretoken', '{{ csrf_token }}');
			      $.ajax({
								   url: window.location,
								   type: 'post',
								   dataType: 'json',
								   data: formData,
								   success: function(data) {
													   console.log(data);
													   console.log(data['errors']);
													},
									// error: function(data) {
									// 					console.log(data);
									// 				alert(data);
									// 			}
								    });	
				}
</script>

{% endblock %}


